/*
 * @Descripttion: 
 * @version: 
 * @Author: ChenXiang
 * @Date: 2021-08-19 13:54:46
 * @LastEditors: ChenXiang
 * @LastEditTime: 2021-09-30 17:19:10
 */
import React, { useEffect, useState } from 'react';
import { ButtonGroup } from '@hocs';

export default () => {
  const [data, setData] = useState(['Apple', "Pear"])
  const [data2, setData2] = useState([])
  const [val, setVal] = useState('')
  const [val2, setVal2] = useState('')
  const [valarr, setValarr] = useState(['1', '2'])
  useEffect(() => {
    // setTimeout(() => {
    //   setData([
    //     { text: '异步1', value: '1' },
    //     { text: 2, value: '2' },
    //     { text: 3, value: '3' },
    //     { text: 4, value: '4' }
    //   ])
    //   setData2([
    //     { text: '异步2', value: '1' },
    //     { text: 2, value: '2' },
    //     { text: 3, value: '3' },
    //     { text: 4, value: '4' }
    //   ])
    //   setVal('2')
    //   setVal2('3')
    // }, 1000)
  }, [])

  return <div>
    <ButtonGroup
      onChange={(e) => {
        console.log(e)
        setData(e)
      }}
      name="cx"
      options={[
        { label: 'Apple', value: 'Apple' },
        { label: 'Pear', value: 'Pear' },
        { label: 'Orange', value: 'Orange' },
      ]}
      value={data}
    />

    {/* async data
    <ButtonGroup
      defaultValue={'4'}
      onChange={(item) => {
        console.log(item);
      }}
      data={[
        { text: '异步1', value: '1' },
        { text: '2', value: '2' },
        { text: '3', value: '3' },
        { text: '4', value: '4' }
      ]}
    />

    <ButtonGroup
      defaultValue={'4'}
      onChange={(item) => {
        console.log(item);
      }}
      data={data}
    /> */}
  </div>;
};